<template>
  <div class="all">
    <el-date-picker
      v-model="formData.start"
      type="datetime"
      placeholder="选择日期"
      value-format="yyyy-MM-dd HH:mm:ss"
      :default-time="'00:00:00'"
    />
    -
    <el-date-picker
      v-model="formData.end"
      type="datetime"
      placeholder="选择日期"
      value-format="yyyy-MM-dd HH:mm:ss"
      :default-time="'23:59:59'"
    />
    <el-input
      v-model="formData.title"
      placeholder="公告标题"
      style="width: 100px; margin-left: 7px; margin-right: 7px"
      @keyup.enter.native="handleFilter"
    />
    <el-input
      v-model="formData.author"
      placeholder="公告发布者"
      style="width: 150px; margin-right: 7px"
      @keyup.enter.native="handleFilter"
    />
    <el-button
      style="margin-left: 10px"
      type="primary"
      icon="el-icon-search"
      @click="handleFilter"
    >
      搜索
    </el-button>
    <el-divider />
    <el-table
      ref="multipleTable"
      v-loading="listLoading"
      :data="contentList"
      element-loading-text="拼命加载中"
      border
      fit
      highlight-current-row
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" align="center" min-width="5%" />
      <el-table-column align="center" label="公告Id" min-width="10%">
        <template slot-scope="scope">
          {{ scope.$index + 1 }}
        </template>
      </el-table-column>
      <el-table-column label="公告内容" min-width="60%">
        <template slot-scope="scope">
          <div @click="showDetail(scope.row, scope.$index)">
            <contentTextComponent
              :title="scope.row.title"
              :text="scope.row.text"
              :author="scope.row.author"
              :time="scope.row.time"
              :section="scope.row.section"
            />
          </div>
        </template>
      </el-table-column>
      <el-table-column label="审核操作" align="center" min-width="15%">
        <template slot-scope="scope">
          <el-button size="mini" type="success" @click="handlePass(scope.row)">
            通过
          </el-button>

          <el-button
            size="mini"
            type="danger"
            @click="handleReject(scope.row, scope.$index)"
          >
            拒绝
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog
      center
      title="详情"
      :visible.sync="dialogContentVisable"
      width="60%"
    >
      <div class="context-title">
        {{ chosenContent.title }}
      </div>
      <div class="box">
        <span class="time">发表时间：{{ chosenContent.time }}</span
        ><span class="section">{{ chosenContent.section }}</span
        ><br />
      </div>
      <div class="context-container">
        <div class="context">
          <br />
          <p style="text-align: justify" v-html="chosenContent.text" />
          <br />
        </div>
        <div class="bj">公告发布者：{{ chosenContent.author }}</div>
        <br style="clear: both" />
      </div>
    </el-dialog>
  </div>
</template>
<script>
import contentTextComponent from "../../components/party/contentText";
export default {
  components: {
    contentTextComponent,
  },
  data() {
    return {
      listLoading: false,
      filterContent: null,
      chosenContent: [],
      contentList: [
        {
          title: "服务送到家里 群众暖在心里",
          text:
            "在广东中山市坦洲镇坦南社区“同心园”党群服务中心，两层楼的办公区域异常热闹：图书室坐满了放学后来做作业的学生，健身室是社区年轻人的天地，老年舞蹈队正在活动室排练节目，室外运动区域随处可见体育爱好者矫健的身影……坦南社区党总支书记黎静怡介绍，服务中心就是供居民使用的开放空间。\n" +
            "\n" +
            "\n" +
            "而在中山市横栏镇新兴西路61号，繁花锦簇的景象引人驻足。院子里，摆满了各色花卉盆栽，成为附近群众散步拍照的好去处。这里是横栏镇五沙村党群服务中心。“现在群众遇到问题、困难，第一时间想到的是找村里、找党群服务中心。”在焕然一新的村党群服务中心内，五沙村党委书记吴玉华颇有感触。\n" +
            "\n" +
            "“自去年3月开始，中山市委组织部全面推进‘同心园’村（社区）党群服务中心建设。”中山市委常委、组织部部长欧阳贵有介绍，按照实体化、功能化、标准化、规范化、信息化要求，中山打造党群服务主阵地，建成313个“同心园”党群服务中心。 \n" +
            "\n" +
            "中山市全面整合近20个部门的功能，将各部门在村（社区）设立的机构、各类党建资源和便民服务资源纳入党群服务中心，提供包括家政维修、理发、健身、快递等50多项“接地气”的便民服务。\n" +
            "\n" +
            "在中山市东区起湾社区党群服务中心内，设有烘焙区、健身房、摄影直播间等功能区。中心改造之后，先后举办了烘焙培训班、摄影技巧培训班、手机视频拍摄班、健身沙龙等，每次参加活动的名额，大都在一个晚上就被抢空。\n" +
            "\n" +
            "在服务对象上，中山市各党群服务中心既服务本地户籍居民，也服务流动人口；既服务老年人和儿童，也特别关注青年，精心做好青年人才联系服务工作，让群众愿意来、留下来、想再来。\n",
          href: "https://segmentfault.com/a/1190000019287040",
          author: "闫妍",
          time: "2021-05-10",
          section: "社区党建",
          checkStatusId: 1,
        },
        {
          title: "信仰之光照亮壮阔征程——解码百年来中国共产党坚如磐石的理想信念",
          text: `<p align="center">国防大学习近平新时代中国特色社会主义思想研究中心</p>
            <br />
        <p align="justify">
          信仰如旗，凝聚磅礴的力量；理想如炬，照亮前行的征程。习主席指出：“中国共产党人的理想信念，建立在马克思主义科学真理的基础之上，建立在马克思主义揭示的人类社会发展规律的基础之上，建立在为最广大人民谋利益的崇高价值的基础之上。”在百年非凡历程中，一代又一代中国共产党人之所以始终坚定理想信念，是因为追求的是真理、遵循的是规律、代表的是最广大人民根本利益。不论时代如何发展、形势怎么变化，我们都要把对马克思主义的信仰、对社会主义和共产主义的信念作为政治灵魂和精神支柱，矢志不渝奋斗，不断争创新的历史荣光。
        </p>
        <br />
        <p>一</p>
        <p align="justify">
          中国共产党人的理想信念，不是凭空产生的，而是建立在马克思主义科学真理的基础之上。真理具有无可辩驳的彻底性和说服力。当人们认识到真理之“真”，就会触发由“真”到“信”的升华，实现从真理向信仰的内化。马克思主义是关于自然、社会和思维发展一般规律的科学，是共产党人的“真经”，其真理性就在于它提供了科学的世界观方法论。实践证明，对马克思主义的认识越深入、越彻底，就越能练就共产党人的钢筋铁骨，铸牢坚守信仰的铜墙铁壁。
        </p>
        <p align="justify">
          中国共产党之所以叫共产党，就是因为自成立之日起我们党就把共产主义确立为远大理想。回望党的百年历史，中国共产党人理想信念的确立并非一时冲动，而是在探索救亡图存的道路上发现马克思主义这个“占据着真理和道义的制高点”的伟大理论之后，所作出的理性选择。在中华民族积贫积弱、任人宰割的时期，各种主义和思潮“你方唱罢我登场”，但都没能解决中国的前途和命运问题。十月革命一声炮响，为中国送来了马克思列宁主义，引导中国人民走出了漫漫长夜，建立了新中国。马克思主义是随着实践而不断发展的开放的理论体系，它并没有结束真理，而是开辟了通向真理的道路。沿着这条道路，一代代中国共产党人高举旗帜、矢志奋斗，坚持把马克思主义基本原理同中国具体实际相结合，走出了一条马克思主义中国化的光辉道路。我们党的历史，就是一部不断推进马克思主义中国化的历史，就是一部不断推进理论创新、进行理论创造的历史。一百年来，我们党坚持解放思想和实事求是相统一、培元固本和守正创新相统一，不断开辟马克思主义新境界，为党和人民事业发展提供了科学理论指导。
        </p>
        <p align="justify">
          心有所信，方能行远。理想信念不是自发产生的，而是与理论认知和理论认同密切相关。共产党人坚定理想信念，必须有“彻底”且“发展”的理论做指引。我们要从党的百年非凡历程中领会马克思主义是如何深刻改变中国、改变世界的，感悟马克思主义的真理力量和实践力量，深化对中国化马克思主义既一脉相承又与时俱进理论品质的认识，真正做到对马克思主义虔诚而执着、至信而深厚。要把学习贯彻习近平新时代中国特色社会主义思想作为首要政治任务，结合中国共产党成立一百年来国家和人民面貌的根本性变化，特别是结合党的十八大以来党和国家事业取得历史性成就、发生历史性变革的生动实践，深刻学习领会新时代党的创新理论，增进高度的政治认同、思想认同、理论认同、情感认同，在习近平新时代中国特色社会主义思想指引下创造新业绩、建功新时代。
        </p>
        <br />
        <p>二</p>
        <p align="justify">
          中国共产党人的理想信念以马克思主义为支撑，建立在马克思主义揭示的人类社会发展规律的基础之上。马克思主义阐明了资本主义必然灭亡和社会主义必然胜利的历史趋势，阐明了必须经过社会主义的充分发展最终走向共产主义的历史必然性。马克思主义犹如壮丽的日出，照亮了人类探索历史规律和寻求自身解放的道路。中国共产党人理想信念的形成与巩固，贯穿于党史、新中国史、改革开放史、社会主义发展史之中，只有深刻认识和把握历史发展的规律和方向，从根本上坚定共产主义远大理想和中国特色社会主义共同理想，才能始终保持清醒的政治头脑，坚定不移坚持和发展中国特色社会主义。
        </p>
        <p align="justify">
          中国共产党人始终立足中国实际坚持和发展马克思主义，探索和遵循中国历史发展的特殊规律，走出了一条中国特色社会主义道路。党的一大提出“建立共产主义社会的最终目标”，党的二大把“渐次达到一个共产主义的社会”作为最高纲领。新中国成立后，我们党创造性地开辟了一条适合中国特点的社会主义改造道路，建立起社会主义基本制度，为当代中国的一切发展进步奠定了根本政治前提和制度基础。党的十一届三中全会作出把党和国家工作重点转移到经济建设上来，实行改革开放的历史性决策，之后我们党逐步确立社会主义初级阶段的基本路线，建立起社会主义基本经济制度。党的十九大对中国特色社会主义发展历史阶段精确定位，作出了中国特色社会主义进入新时代的重大判断。习主席指出：“坚持和发展中国特色社会主义是一篇大文章，邓小平同志为它确定了基本思路和基本原则，以江泽民同志为核心的党的第三代中央领导集体、以胡锦涛同志为总书记的党中央在这篇大文章上都写下了精彩的篇章。现在，我们这一代共产党人的任务，就是继续把这篇大文章写下去。”一百年来，一代代中国共产党人为实现共产主义远大理想和中国特色社会主义共同理想奋斗前行的足迹，构成了我们党为中国人民谋幸福、为中华民族谋复兴的奋斗史。
        </p>
        <p align="justify">
          自觉把握历史规律是中国共产党的理论优势，按历史规律办事也是中国共产党的实践品格。对历史发展规律、方向和趋势的深刻把握，是共产党人坚定理想信念、认清社会现实、把握历史大势的理论基础。实践没有止境，对历史规律的认识和把握也没有止境。我们要结合新时代坚持和发展中国特色社会主义的新情况新问题，注重在总结历史经验的基础上，不断深化对共产党执政规律、社会主义建设规律、人类社会发展规律的认识。党员干部要胸怀中华民族伟大复兴战略全局和世界百年未有之大变局，树立大历史观，从历史长河、时代大潮、全球风云中分析演变机理、探究历史规律，坚定中国特色社会主义道路自信和战略定力，开启全面建设社会主义现代化国家新征程。
        </p>
        <br />
        <p>三</p>
        <p align="justify">
          中国共产党人的理想信念，还建立在为最广大人民谋利益的崇高价值的基础之上。马克思、恩格斯在《共产党宣言》中指出：“过去的一切运动都是少数人的，或者为少数人谋利益的运动。无产阶级的运动是绝大多数人的，为绝大多数人谋利益的独立的运动。”我们党对理想信念的坚守和追寻，出自对人民的赤子之心。中国共产党人始终做到初心如磐、使命在肩，获得了人民群众的衷心拥护和鼎力支持，这是我们党克服任何困难、无往而不胜的关键所在。
        </p>
        <p align="justify">
          人民性是马克思主义最鲜明的品格。我们党的百年历史，就是一部践行党的初心使命的历史，就是一部党与人民心连心、同呼吸、共命运的历史。从新民主主义到中国特色社会主义，理论形态变化的背后，始终不变的是“为了人民”的政治信念。从推翻“三座大山”建立人民当家作主的新中国，到确立社会主义基本制度建立起独立的比较完整的工业体系和国民经济体系，再到实行改革开放开创中国特色社会主义道路，每一个历史时期，每一个发展阶段，我们党所付出的一切努力、进行的一切斗争、作出的一切牺牲，都是为了人民幸福和民族复兴。进入新时代，我们党坚持以人民为中心的发展思想，统筹推进“五位一体”总体布局，协调推进“四个全面”战略布局，立足新发展阶段，贯彻新发展理念，构建新发展格局，不断开辟中国特色社会主义发展新境界。无论是夺取抗疫斗争重大战略成果、取得脱贫攻坚战全面胜利，还是制定国民经济和社会发展“十四五”规划和2035年远景目标纲要，我们党始终把人民作为决定党和国家前途命运的根本力量，把民心作为最大的政治，坚持把人民放在心中最高位置，使人民不断提升获得感、幸福感、安全感。
        </p>
        <p align="justify">
          理想信念的坚守既是一个认识问题，也是一个实践问题。新时代，人民的内涵在不断变化和拓展，人们的价值观随着思想文化的多元多样也在不断更新发展，对中国共产党人坚守理想信念提出了新的考验。我们要深刻认识到，“人民”二字在习近平新时代中国特色社会主义思想中具有基础性、根本性的地位和作用，从而进一步深化对人民内涵的理解把握，笃定践行中国共产党人的初心使命，把人民对美好生活的向往作为奋斗目标，把实现好、维护好、发展好最广大人民的根本利益作为一切工作的出发点和落脚点，解决好人民最关心最直接最现实的利益问题，凝聚和激发起全体人民跟党走中国特色社会主义道路、实现中华民族伟大复兴的磅礴力量。
        </p>`,
          author: "闫妍",
          time: "2021-05-10",
          section: "党建要闻",
          checkStatusId: 1,
        },
      ],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      dialogContentVisable: false,
      chosenIndex: null,
      searchTime: null,
      formData: {
        start: "",
        end: "",
        title: "",
        author: "",
      },
    };
  },
  created: {
    getReady() {
      this.listLoading = true;
      this.filterContent = this.contentList;
    },
  },
  methods: {
    handleReject(row, index) {},
    handlePass(row) {},
    showDetail(row, index) {
      this.chosenContent = Object.assign({}, row);
      this.chosenIndex = index;
      this.dialogContentVisable = true;
    },
  },
};
</script>
<style scoped>
.all {
  width: 80%;
  min-width: 900px;
  margin: 35px auto;
}
.context-title {
  font-size: 24px;
  color: #444444;
  text-align: center;
  font-weight: bold;
  line-height: 38px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}
.context {
  color: #444444;
  font-size: 16px;
  line-height: 32px;
  padding: 0 18px;
}
.bj {
  float: right;
  margin-top: 75px;
  color: #777777;
}
.context-container {
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
  padding: 0 0 20px;
}
.time {
  color: #999;
  font-size: 14px;
  float: left;
  line-height: 30px;
  height: 30px;
  font-size: 14px;
}
.section {
  color: #999;
  font-size: 14px;
  float: left;
  line-height: 30px;
  height: 30px;
  font-size: 14px;
  margin-left: 10px;
}
</style>
